<%@ page contentType="text/html;charset=UTF-8" language="java"%>
<%@include file="./acommon.jsp"%>
<!DOCTYPE html>
<html lang="zh">
<meta charset="utf-8">
<head>
<!-- Meta Tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Candidate HTML Template</title>
<link rel="shortcut icon" type="image/x-icon" href="img/favicon.ico">
</head>
<style>
#newsList {
	padding: 0px 11px 20px 25px
}

#newsList li {
	padding-left: 15px;
	background:
		url('http://www.chinatax.gov.cn/dbsource/2760543/2866472.jpg')
		no-repeat 0px 8px;
	list-style-type: none;
}
</style>

<body class="sticky-header-on tablet-sticky-header">
	<div id="fb-root"></div>
	<!-- Container -->
	<div class="container">
		<!-- Header -->
		<header id="header" class="animate-onscroll">
			<!-- Main Header -->
			<div id="main-header">
				<div class="container">
					<div class="row">
						<!-- Logo -->
						<div id="logo" class="col-lg-3 col-md-3 col-sm-3">
							<a href="main-v1.html">
								<img src="http://www.chinatax.gov.cn/dbsource/3999969/3999971.png" alt="Logo">
							</a>
						</div>
						<!-- /Logo -->
						<!-- Main Quote -->
						<div class="col-lg-5 col-md-4 col-sm-4"></div>
						<!-- /Main Quote -->
						<!-- Newsletter -->
						<!-- <div class="col-lg-4 col-md-5 col-sm-5">
                        <form id="newsletter" action="php/newsletter-form.php" method="POST">
                            <h5>
                                <strong>查询新闻</strong>
                            </h5>
                            <div class="newsletter-form">
                                <div class="newsletter-email">
                                    <input type="text" name="newsletter-email" placeholder="搜索新闻">
                                </div>
                                <div class="newsletter-submit">
                                    <input type="submit" value="">
                                    <i class="icons icon-right-thin"></i>
                                </div>
                            </div>
                        </form>
                    </div> -->
						<!-- /Newsletter -->
					</div>
				</div>
			</div>
			<!-- /Main Header -->
			<!-- Lower Header -->
			<div id="lower-header">
				<div class="container">
					<div id="menu-button">
						<div>
							<span></span>
							<span></span>
							<span></span>
						</div>
						<span>Menu</span>
					</div>

					<ul id="navigation">
						<!-- Home -->
						<li class="home-button current-menu-item">
							<a href="${ctx }/">
								<i class="icons icon-home"></i>
							</a>

						</li>
						<!-- /Home -->
						<!-- Pages -->
						<li>
							<a href="${ctx }/index/newsList">
								<span>税务新闻</span>
							</a>
						</li>
						<!-- /Pages -->

						<!-- Media -->

						<li>
							<a href="${ctx }/">违章公告</a>

						</li>
						<!-- /Media -->


						<!-- Get Involved -->
						<li>
							<a href="${ctx }/">举报</a>
						</li>
						<!-- /Get Involved -->


						<!
                    -- Events -->
						<li>
							<a href="${ctx }/index/about">
								<span>网站介绍</span>
							</a>

						</li>
						<!-- /Events -->


						<!-- Donate -->
						<li class="donate-button ">
							<a href="#">欢迎，你好！</a>
						</li>
						<!-- /Donate -->

					</ul>

				</div>

			</div>
			<!-- /Lower Header -->


		</header>
		<!-- /Header -->


		<section id="content">

			<!-- Section -->
			<section class="section full-width-bg">

				<div class="row">

					<div class="col-lg-12 col-md-12 col-sm-12">

						<!-- Main Slider -->
						<div class="flexslider main-flexslider animate-onscroll">

							<ul class="slides">
								<c:forEach items="${photosList}" var="photos" varStatus="vs">
									<li id="main_flex_${vs.index +1}" style="background:url('${ctx}/${photos.pictureUrl}') no-repeat;cursor:pointer;"></li>
								</c:forEach>

							</ul>

						</div>
						<!-- /Main Slider -->
					</div>


				</div>

			</section>
			<!-- /Section -->


			<div class="copyrights">
				Collect from
				<a href="http://www.cssmoban.com/">手机网站模板</a>
			</div>

			<!-- Section -->
			<section class="section full-width-bg gray-bg">

				<div class="row">

					<div class="col-lg-8 col-md-8 col-sm-7">

						<h3 class="animate-onscroll no-margin-top">最新公告</h3>

						<!-- Blog Post -->
						<div class="blog-post big animate-onscroll" style="height: 300px;">

							<div class="post-image">
								<img src="${ctx}/${newsList[0].newsPhotoUrl}" alt="">
							</div>

							<h4 class="post-title">
								<a href="${ctx }/index/news/${newsList[0].newsId }">${newsList[0].newsTitle }</a>
							</h4>

							<div class="post-meta">
								<span>
									发布于&nbsp;
									<a href="#">${newsList[0].createBy }</a>
								</span>
								<span>
									<fmt:formatDate value="${newsList[0].createTime }" pattern="yyyy-MM-dd HH:mm:ss" />
								</span>
							</div>
							<p id="showNews"></p>

							<div>
								<a href="${ctx }/index/news/${newsList[0].newsId }" class="button read-more-button big button-arrow">Read More</a>
							</div>

						</div>
						<!-- /Blog Post -->
					</div>
					<!-- Sidebar -->
					<div class="col-lg-4 col-md-4 col-sm-5 sidebar">
						<!-- Featured Video -->
						<div class="sidebar-box white featured-video animate-onscroll" style="height: 340px;    overflow: hidden;">
							<h3>
								<a href="#">更多公告>></a>
							</h3>
							<ul id="newsList">

								<c:forEach begin="1" end="9" items="${newsList}" var="taxNews">
									<li>
										<a href="${ctx }/index/news/${taxNews.newsId }" class="button transparent button-arrow">${taxNews.newsTitle}</a>
									</li>
								</c:forEach>


							</ul>
						</div>

					</div>
					<!-- /Sidebar -->


				</div>


				<!-- Owl Carousel -->
				<div class="owl-carousel-container">

					<div class="owl-header">

						<h3 class="animate-onscroll">其他信息</h3>

						<div class="carousel-arrows animate-onscroll">
							<span class="left-arrow">
								<i class="icons icon-left-dir"></i>
							</span>
							<span class="right-arrow">
								<i class="icons icon-right-dir"></i>
							</span>
						</div>

					</div>

					<div class="owl-carousel" data-max-items="3">
						<c:forEach items="${TaxList}" var="tax" varStatus="vs">
							<!-- Owl Item -->
							<div>
								<!-- Blog Post -->
								<div class="blog-post animate-onscroll">
									<div class="post-image">
										<img src="${ctx}/${tax.newsPhotoUrl}" alt="">
									</div>
									<h4 class="post-title">
										<a href="${ctx }/index/news/${tax.newsId }">${tax.newsTitle}</a>
									</h4>
									<div class="post-meta">
										<span>
											by
											<a href="#">${tax.createBy }</a>
										</span>
										<span>
											<fmt:formatDate value="${tax.createTime }" pattern="yyyy-MM-dd HH:mm:ss" />
										</span>
									</div>
									<div class="sdw" id="content${vs.index}">
										<p>${tax.newsContent}</p>
									</div>
									<a href="${ctx }/index/news/${tax.newsId }">Read More</a>
								</div>
								<!-- /Blog Post -->

							</div>
							<!-- /Owl Item -->
						</c:forEach>


					</div>

				</div>
				<!-- /Owl Carousel -->
			</section>
			<!-- /Section -->

		</section>
		<!-- Footer -->
		<jsp:include page="afooter.jsp" />
		<!-- /Footer -->
	</div>
	<!-- /Container -->
</body>
<script type="text/javascript">

	function delHtmlTag() {
		var str = '${newsList[0].newsContent}';
		str = str.replace(/<[^>]+>/g, ""); //正则去掉所有的html标记
		if (str.length > 50) {
			str = str.substring(0, 47);
			str += "..."
		}
		$("#showNews").html(str);
	}

	function delHtmlp() {
		$(".sdw").each(function(index, element) {
			var str = $(element).text();
			str = str.replace(/<[^>]+>/g, ""); //正则去掉所有的html标记
			if (str.length > 100) {
				str = str.substring(0, 97);
				str += "..."
			}
			$("#content" + index).html(str)
		});
	}
	setTimeout(function() {
		delHtmlTag()
		delHtmlp()
	}, 2000);
</script>

</html>